<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="ffmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>超市账单管理系统</title>
    <jsp:include page="common/head.jsp"/>
</head>
<body>
<!--头部-->
<jsp:include page="common/top.jsp"/>
<!--主体内容-->
<section class="publicMian ">
    <jsp:include page="common/left.jsp"/>
    <div class="right">
        <div class="location">
            <strong>你现在所在的位置是:</strong>
            <span>账单管理页面</span>
        </div>
        <form action="<%=request.getContextPath()%>/bill/list.html" method="post" id="searchForm">
            <input type="hidden" name="pageNum" id="pageNum"/>
            <div class="search">
                <span>商品名称：</span>
                <input type="text" name="goodsName" value="${param.goodsName}" placeholder="请输入商品的名称"/>
                <span>供应商：</span>
                <select name="supplier.id">
                    <option value="">--请选择--</option>
                    <c:forEach items="${requestScope.supplierList}" var="s">
                        <option value="${s.id}" ${bill.supplier.id eq s.id?'selected':''}>${s.name}</option>
                    </c:forEach>
                </select>

                <span>是否付款：</span>
                <select name="status">
                    <option value="">--请选择--</option>
                    <option value="1" ${param.status eq '1'?'selected':''}>已付款</option>
                    <option value="0" ${param.status eq '0'?'selected':''}>未付款</option>
                </select>
                <input type="button" value="查询" onclick="$('#searchForm').submit()"/>
                <a href="billAdd.html">添加订单</a>
            </div>
        </form>
        <!--账单表格 样式和供应商公用-->
        <table class="providerTable" cellpadding="0" cellspacing="0">
            <tr class="firstTr">
                <th width="10%">账单id</th>
                <th width="20%">商品名称</th>
                <th width="10%">供应商</th>
                <th width="10%">账单金额</th>
                <th width="10%">是否付款</th>
                <th width="10%">创建时间</th>
                <th width="30%">操作</th>
            </tr>
            <c:forEach items="${requestScope.pageInfo.list}" var="b">
                <tr class="firstTr">
                    <th width="10%">${b.id}</th>
                    <th width="20%">${b.goodsName}</th>
                    <th width="10%">${b.supplier.name}</th>
                    <th width="10%">${b.amount/100.0}</th>
                    <th width="10%">${b.status eq 1?'已付款':'未付款'}</th>
                    <th width="10%"><fmt:formatDate value="${b.createdTime}" pattern="yyyy-MM-dd"/></th>
                    <th width="30%">操作</th>
                </tr>
            </c:forEach>
        </table>
        <div style="float:right;padding:10px">
            <c:if test="${pageInfo.hasPreviousPage}">
                <a href="javascript:void(0)" onclick="goPage(1)">首页</a>
                <a href="javascript:void(0)" onclick="goPage(${pageInfo.prePage})">上一页</a>
            </c:if>
            <c:forEach items="${pageInfo.navigatepageNums}" var="num">
                <a href="javascript:void(0)" onclick="goPage(${num})"
                   style="color:${num eq pageInfo.pageNum?'red':''}">${num}</a>
            </c:forEach>
            <c:if test="${pageInfo.hasNextPage}">
                <a href="javascript:void(0)" onclick="goPage(${pageInfo.nextPage})">下一页</a>
                <a href="javascript:void(0)" onclick="goPage(${pageInfo.pages})">尾页</a>
            </c:if>
            当前第${pageInfo.pageNum}/${pageInfo.pages}
        </div>
    </div>
</section>
<script type="text/javascript">
    function goPage(pn) {
        $("#pageNum").val(pn);
        $("#searchForm").submit()
    }
</script>
<!--点击删除按钮后弹出的页面-->
<div class="zhezhao"></div>
<div class="remove" id="removeBi">
    <div class="removerChid">
        <h2>提示</h2>
        <div class="removeMain">
            <p>你确定要删除该订单吗？</p>
            <a href="#" id="yes">确定</a>
            <a href="#" id="no">取消</a>
        </div>
    </div>
</div>

<footer class="footer">
</footer>

<script src="js/jquery.js"></script>
<script src="js/js.js"></script>
<script src="js/time.js"></script>

</body>
</html>